<template>
  <div class="Szjjdjlbdialog">
    <div
      style="
        width: 98%;
        height: 55%;
        margin-top: 6%;
        border: 1px solid #182c56;
        border-radius: 10px;
        position: relative;
        padding-left: 2%;
      "
    >
      <div style="" class="szjyxmxq">
        <p>采购全流程</p>
        <p id="getpagecode">{{ code }}</p>
        <img src="../assets/szjyxmxqjiantou.png" style="height: 100%" />
      </div>
      <div
        style="height: 82%; width: 101%; margin-top: 3.5%"
        :class="
          chuliarr.length > 5
            ? 'scrollcgxq'
            : chuliarr.length <= 4
            ? 'scrollcgxq2'
            : ''
        "
      >
        <div
          class="szjymiddlexmxqbg"
          id="mainszjjjiaoyi"
          v-if="showchuliarr"
          :class="chuliarr.length > 5 ? '' : 'justcontenaro'"
        >
          <div
            v-for="(item, index) in chuliarr"
            :key="index"
            :class="[
              index == 0 ? 'szjymiddlexmxqbgdiv1' : 'szjymiddlexmxqbgdiv',
            ]"
            @click="clickobj(item)"
          >
            <div>
              <div
                style="position: absolute; top: 2%; left: 3%; font-size: 0.8rem"
              >
                {{ item.nodename }}
              </div>
              <div
                style="
                  position: absolute;
                  top: 31%;
                  left: 3%;
                  font-size: 0.8rem;
                  display: flex;
                  width: 87%;
                "
              >
                <p style="width: 45%; font-size: 0.8rem">业务名称：</p>
                <p
                  style="width: 55%; font-size: 0.8rem; word-wrap: break-word"
                  class="textchulithird"
                  id="jhglywmc"
                  :title="item.belongname"
                >
                  {{ item.belongname }}
                </p>
              </div>
              <div
                style="
                  position: absolute;
                  top: 68%;
                  left: 3%;
                  font-size: 0.8rem;
                  display: flex;
                  width: 87%;
                "
              >
                <p style="width: 50%">业务编号：</p>
                <p
                  style="
                    width: 55;
                    font-size: 0.8rem;
                    word-wrap: break-word;
                    align-self: center;
                  "
                  id="jhglywbh"
                  :title="item.belongcode"
                >
                  {{ item.belongcode }}
                </p>
              </div>
            </div>
          </div>
        </div>
        <div
          class="szjymiddlexmxqbg zuobianjv"
          style="height:2rem"
          v-if="showchuliarr"
          :style="{ width: chuliarr.length > 5 ? '90%' : '80%' }"
        >
          <div
            v-for="(item1, index1) in chuliarr.length - 1"
            :key="index1"
            :style="{ minWidth: chuliarr.length > 5 ? '23%' : `${widthVal}%` }"
          >
            <img
              style="width: 100%;height:2rem"
              src="../assets/szjymiddlexmxqfirstjiantou.png"
              v-if="index1 == 0"
            />
            <img
              style="width: 100%;height:2rem"
              src="../assets/szjymiddlexmxqsecondjiantou.png"
              v-else-if="chuliarr.length - 1 > index1"
            />
          </div>
        </div>
        <div
          v-else
          class="szjymiddlexmxqbg"
          style="
            display: flex;
            align-items: center;
            justify-content: space-around;
          "
        >
          <dv-loading>Loading...</dv-loading>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import APIS from "@/api/index";
import { Message } from "element-ui";
import axios from "axios";
export default {
  props: {
    code: {
      type: String,
    },
    id: {
      type: String,
    },
    obj: {
      type: Object,
    },
    tendercode: {
      type: String,
    },
  },
  data() {
    return {
      chuliarr: [],
      url: "",
      timeerclick: false,
      widthVal: "",
      showchuliarr: false,
    };
  },
  watch: {
    code(newVal, oldVal) {
      this.getgetDataTrace();
    },
    chuliarr(newVal, oldVal) {
      console.log(this.chuliarr.length, "this.chuliarr.length");
      this.widthVal = 100 / (this.chuliarr.length - 1);
    },
  },
  mounted() {
    this.getgetDataTrace();
    console.log(this.code, "this.code");
  },

  methods: {
    clickobj(item) {
      console.log(item, "item");
      if (item.nodename != "合同管理") {
        window.open(item.href);
        return;
      } else {
        if (this.timeerclick) {
          console.log(item, "item");
          if (item.nodename == "合同管理") {
            if (item.href.indexof("srm.cnzgc.com" == -1)) {
              console.log("不存在");
              this.gotojudge(2);
            } else {
              console.log("存在");
              window.open(item.href);
            }
          }
        } else {
          window.open(item.href);
        }
      }
    },
    gotojudge(num) {
      let obj = {};
      console.log(111, this.tendercode);
      // const axios = require("axios");

      // 定义要发送的XML数据
      const xmlData = `<?xml version="1.0" encoding="utf-8"?>
<soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope">
 <soap12:Body>
  <GetLoginAdress xmlns="http://tempuri.org/">
   <ZBJG>${this.tendercode}</ZBJG>
  </GetLoginAdress>
 </soap12:Body>
</soap12:Envelope>`;
      // ${this.tendercode} ZBRW-2021-005645
      // 发送POST请求  http://10.0.12.114:8888/PG9_ZJJSTZ/WebService/ZCHTDDDLService.asmx
      // https://srm.cnzgc.com/zjszjj/pm/PG9_ZJJSTZ/WebService/ZCHTDDDLService.asmx

      // axios.defaults.baseURL = "/abc";
      axios
        .post(
          "https://srm.cnzgc.com/zjszjj/pm/PG9_ZJJSTZ/WebService/ZCHTDDDLService.asmx",
          xmlData,
          {
            headers: {
              "Content-Type": "text/xml; charset=utf-8",
              SOAPAction: "http://tempuri.org/GetLoginAdress",
            },
          }
        )
        .then((response) => {
          this.timeerclick = false;

          console.log(response.data, "response");
          let reg = "<GetLoginAdressResult>(.*?)</GetLoginAdressResult>";
          let result = response.data.match(reg);
          if (result != null && result[1]) {
            let silverRegex = /&amp;/g;
            let str = result[1].replace(silverRegex, "&");
            console.log(result, result[1], str);
            this.url = str;
            if (num == 2) {
              if (str) {
                this.chuliarr[4].href = str;
                window.open(str);
              }
            } else {
              if (str) {
                this.chuliarr.map((item) => {
                  if (item.nodename == "招标管理") {
                    if (str) {
                      obj = { ...item, href: str, nodename: "合同管理" };
                      this.chuliarr.push(obj);
                    }
                  }
                });
              }
            }
          } else {
            if (num == 2) {
              this.chuliarr[4].href = "1111";
            }
            // else {
            //   this.chuliarr.map((item) => {
            //     if (item.nodename == "招标管理") {
            //       obj = { ...item, href: "1111", nodename: "合同管理" };
            //       this.chuliarr.push(obj);
            //     }
            //   });
            // }
          }

          setTimeout(() => {
            console.log("到点了");
            this.timeerclick = true;
          }, 90000);
          this.showchuliarr = true;
        })
        .catch((error) => {
          console.error(error, "jinrubaocuojieduan");
          this.showchuliarr = true;
        });
    },
    getgetDataTrace() {
      console.log(this.obj,'this.obj')
      let chuliarr = [];
      this.chuliarr = [];
      APIS.Szjy.getDataTrace({ id: this.id }).then((res) => {
        console.log(res, "res");
        res.data.map((item, index) => {
          if (item.nodename == "合同管理") {
            item.href = `https://srm.cnzgc.com/contract/contractbuy/simple/v?_m=edit&type=1&contractid=${item.belongid}&_empid=${item.employeeid}&subject=1&objtype=${this.obj.objectType}`;
            chuliarr = res.data;
          } else {
            if (item.nodename == "招标管理") {
              item.href = `https://srm.cnzgc.com/sourcing/buyer/proc/tender.html?isproc=1&tenderid=${this.obj.tenderId}&pctype=${this.obj.procType}&proctype=${this.obj.procType}&objtype=${this.obj.objectType}&src=list&clientuserid=20f3b8cc341f7fbbae64ffbd5f49bfcb`;
              chuliarr = [...res.data];

              // let obj = item;
              // obj = {
              //   ...item,
              // };
              // obj.href = "1111";
              // obj.nodename = "合同管理";
              // chuliarr.push(obj);
            } else if (item.nodename == "计划管理") {
              item.href = `https://srm.cnzgc.com/plan/simple/v?_m=pur/add&planid=${item.belongid}&objtype=${this.obj.objectType}&plantype=${this.obj.planLevel}&busstype=${this.obj.bussType}`;
            } else if (item.nodename == "采购任务") {
              item.href = `https://srm.cnzgc.com/plan/simple/v?_m=task/mydetail&proctaskid=${this.obj.tenderId}&planid=${item.belongid}&_empid=${item.employeeid}&objtype=${this.obj.objectType}&busstype=${this.obj.bussType}&readonly=true`;
            } else if (item.nodename == "采购方案") {
              item.href = `https://srm.cnzgc.com/sourcing/buyer/tender/project/proc_add?tenderid=${this.obj.tenderId}&_empid=${item.employeeid}&objtype=${this.obj.objectType}&proctype=${this.obj.procType}`;
            }
          }
        });
        this.chuliarr = chuliarr;

        // this.chuliarr.push(
        //   { href: "https://www.baidu.com", nodename: "合同管理1" },
        //   // { href: "https://www.baidu.com", nodename: "合同管理1" },
        // );

        if (!res.data.some((item) => item.nodename == "合同管理")) {
          this.gotojudge();
        } else {
          this.showchuliarr = true;
        }

        // res.data.map((item, index) => {
        //   if (item.nodename != "招标管理") {

        //   }
        // })
        // if (res.data.length == 4) {
        // }
      });
    },
  },
};
</script>
 
<style lang="scss">
.Szjjdjlbdialog {
  width: 98%;
  height: 95%;
  font-size: 1rem;
  margin: 0 auto;
  .szjyxmxq {
    background-image: url("../assets/szjyxmxqtopbg.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 24%;
    height: 30px;
    position: absolute;
    top: -15px;
    left: 20px;
    display: flex;
    color: white;
    justify-content: space-between;
    align-items: center;
    padding: 0.2%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
  }
  .szjymiddlexmxqbg {
    height: 80%;
    width: 101%;
    display: flex;
    color: #182c56;
  }
  .szjymiddlexmxqbgdiv {
    min-width: 20%;
    height: 100%;
    background-image: url("../assets/szjymiddlexmxqsecond.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: relative;
    font-size: 1rem;
  }
  .szjymiddlexmxqbgdiv1 {
    min-width: 20%;
    height: 100%;
    background-image: url("../assets/szjymiddlexmxqfirst.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: relative;
  }
  .szjymiddlexmxqbgdiv > div > a {
    color: rgb(24, 44, 86);
  }
  .szjymiddlexmxqbgdiv :hover {
    color: rgba(24, 44, 86, 0.7);
  }
  .szjymiddlexmxqbgdiv1 > div > a {
    color: #182c56;
  }
  .szjymiddlexmxqbgdiv1 :hover {
    color: rgba(24, 44, 86, 0.7);
  }
  .textchulithird {
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    word-break: break-all;
  }
}
.scrollcgxq {
  width: 98% !important;
  overflow-y: hidden;
  overflow-x: scroll;
}
.scrollcgxq2 {
  width: 100% !important;
  margin-left: -1%;
}
.scrollcgxq::-webkit-scrollbar-thumb {
  background-color: #182c56;
}
.scrollcgxq::-webkit-scrollbar {
  width: 80%;
  height: 5px;
  background-color: #dae1f0;
}
.zuobianjv {
  padding-left: 10%;
  height: 2rem;
}
.justcontenaro {
  justify-content: space-around;
}
.classminwidth {
  min-width: 20%;
}
</style>
 

